<template>
	<view class="swiper_box_lyn">
		<view class="uni-margin-wrap">
			<swiper class="swiper myswiper1" circular :indicator-dots="indicatorDots" :autoplay="autoplay" :interval="interval"
				:duration="duration">
				<swiper-item v-for="(item,index) in background" :key="index">
					<!-- <image src="https://p1.music.126.net/ANhG_vzaUqV1Gx8d28OcFg==/109951168947095577.jpg?imageView&quality=89" mode=""></image> -->
					<view class="swiper-item uni-bg-red myswiperitem">
						<img :src="item" alt="">
					</view>
				</swiper-item>
			</swiper>
		</view>
	</view>
</template>

<script lang="ts">
	export default {
		name: "mySwiper",
		data() {
			return {
				background: ['https://p1.music.126.net/ANhG_vzaUqV1Gx8d28OcFg==/109951168947095577.jpg?imageView&quality=89', 
				'https://p1.music.126.net/il1DeEprZLASFkUo7ZGftA==/109951168947071071.jpg?imageView&quality=89', 
				'https://p1.music.126.net/dD7iLJzZbjvsrDHtby8I6w==/109951168947090697.jpg?imageView&quality=89',
				'https://p1.music.126.net/usRWVyfCAHXTzbYsAys6-g==/109951168947065996.jpg?imageView&quality=89',
				'https://p1.music.126.net/hjMmit7XOGh3bhwR9pGNAw==/109951168947120790.jpg?imageView&quality=89'
				],
				indicatorDots: true,
				autoplay: true,
				interval: 2000,
				duration: 500
			};
		}
	}
</script>

<style lang="scss">
.swiper_box_lyn{
	.uni-margin-wrap{
			
		.myswiper1{
			margin: 20rpx 25rpx;
			.myswiperitem{
				border-radius: 25rpx;
				img{
					width: 700rpx;
					height: 300rpx;
					border-radius: 25rpx;
				}
			}
			
		}
	}
}
</style>